<!DOCTYPE html>
<html lang="cmn-Hans" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>设置文档分类</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" th:href="@{/frame/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/customer_admin.css}" media="all">
</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">设置文档分类</div>
        <div class="layui-card-body">
            <div id="treeContent"></div>
        </div>
    </div>
</div>
<script th:src="@{/frame/layui/layui.js}"></script>
<script>
    layui.config({
        base: '/frame/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index','tree'], function () {
        const tree = layui.tree;
        const $ = layui.$;
        function getData(){
            let groupData;
            $.ajax({
                async:false,
                type:'post',
                url:'[[@{/group/admin/getAllWithTreeDate}]]',
                success:function (res) {
                    groupData=res;
                }
            });
            return groupData.data;
        }

        const inst1 = tree.render({
            elem: '#treeContent',
            data: getData(),
            edit: ['add', 'update', 'del'],
            operate: function (obj) {
                const type = obj.type; //得到操作类型：add、edit、del
                const data = obj.data; //得到当前节点的数据
                const elem = obj.elem; //得到当前节点元素

                //Ajax 操作
                const id = data.id; //得到节点索引
                if (type === 'add') { //增加节点
                    let newid;
                    $.ajax({
                        async: false,
                        type: 'post',
                        url: '[[@{/group/admin/addGroup}]]',
                        data: {'belongid': id, 'groupname': '未命名'},
                        success: function (res) {
                            newid = res;
                        }
                    });
                    //返回 key 值
                    return newid;
                } else if (type === 'update') { //修改节点
                    $.ajax({
                        async: false,
                        type: 'post',
                        url: '[[@{/group/admin/editGroup}]]',
                        data: {'groupid': id, 'groupname': elem.find('.layui-tree-txt').html()},
                        success: function (res) {
                            if (res) {
                                layer.msg('修改成功！');
                            } else {
                                layer.msg('修改失败！');
                            }
                        }
                    });
                } else if (type === 'del') { //删除节点
                    $.ajax({
                        async: false,
                        type: 'post',
                        url: '[[@{/group/admin/delGroup}]]',
                        data: {'groupid': id},
                        success: function (res) {
                            if (res) {
                                layer.msg('删除成功！');
                            } else {
                                layer.msg('删除失败！存在与之相关联的文档或子分类。');
                            }
                        }
                    })
                }
            }
        });
    });
</script>
</body>
</html>